import {reactive, ref} from "vue";
import router from "@/router";

export default function useTabComposition() {
    const activeName = ref('add')
    const activeList = reactive(['add', 'done', 'delete', 'all'])
    const handleClick = (tab) => {
        if (tab.paneName === activeList[0]) {
            router.push('/add')
        } else if (tab.paneName === activeList[1]) {
            router.push('/done')
        } else if (tab.paneName === activeList[2]) {
            router.push('/delete')
        } else if (tab.paneName === activeList[3]) {
            router.push('/all')
        }
    }
    return {
        activeName,
        activeList,
        handleClick
    }
}
